Banner 轮播图之简单使用 |
您所在的位置：网站首页 › ios banner轮播图 › Banner 轮播图之简单使用 |
Banner 轮播图之简单使用
|
一：Banner库简介
项目地址：https://github.com/youth5201314/banner。该库是基于RecyclerView和ViewPager来实现的。在之前要实现轮播图需要先自定义一简单RecyclerView，然后使用Timer来转动其坐标位置，对初学者而言十分不友好。由于官网上讲的详细，所以本文是本着“最通俗、最易懂、最简单”而来。 二：使用方法由于该库是基于RecyclerView的，也就是说只要有RecyclerView的基础，上手该库没有任何难度且快速。 1：添加依赖 implementation 'com.youth.banner:banner:2.1.0' 2：定义布局（Banner和其子项布局）Banner布局： 说明： banner_radius用来设置其图片圆角的半径，单位dp banner_loop_time用来设置其每张图片展示的事件，单位毫秒 子项布局： 说明：这里的ImageView的width与height大小必须为match_parent 3：创建Bean public class ImageBean { private int imageViewID; public ImageBean(int imageViewID){ this.imageViewID = imageViewID; } public void setImageViewID(int imageViewID) { this.imageViewID = imageViewID; } public int getImageViewID() { return imageViewID; } }说明：这里展示的话只展示图片信息，所以只有imageViewID这个属性 4：创建适配器这里的适配器与 RecyclerView的适配器并无二意，不在赘述。 public class ImageAdapter extends BannerAdapter { Context context; @Override public ImageHolder onCreateHolder(ViewGroup parent, int viewType) { return new ImageHolder(LayoutInflater.from(context).inflate(R.layout.banner_item, parent, false)); } @Override public void onBindView(ImageHolder holder, ImageBean data, int position, int size) { holder.imageView.setImageResource(data.getImageViewID()); holder.imageView.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { Toast.makeText(context,"Test", Toast.LENGTH_SHORT).show(); } }); } public class ImageHolder extends RecyclerView.ViewHolder{ ImageView imageView; public ImageHolder(@NonNull View itemView) { super(itemView); imageView = (ImageView) itemView.findViewById(R.id.image_view_item); } } public ImageAdapter(Context context, List mList) { super(mList); this.context = context; } } 5：在活动中使用 public class MainActivity extends AppCompatActivity { private Banner mBanner; private List mList = new ArrayList(); private void initView(){ mBanner = (Banner) findViewById(R.id.banner); mBanner.setAdapter(new ImageAdapter(MainActivity.this, mList)); // Set Banner is auto to loop. mBanner.isAutoLoop(true); // Set an indicator for Banner. mBanner.setIndicator(new CircleIndicator(this)); mBanner.start(); } private void initData(){ mList.add(new ImageBean(R.drawable.a)); mList.add(new ImageBean(R.drawable.b)); mList.add(new ImageBean(R.drawable.c)); mList.add(new ImageBean(R.drawable.d)); mList.add(new ImageBean(R.drawable.e)); } @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); initData(); initView(); } } 6：如果仅仅是展示图片而不附加任何信息，可以直接调用系统提供的Adapter。 public class MainActivity extends AppCompatActivity { private Banner mBanner; private List mList = new ArrayList(); private void initView(){ mBanner = (Banner) findViewById(R.id.banner); Banner banner = mBanner.setAdapter(new BannerImageAdapter(mList) { @Override public void onBindView(BannerImageHolder holder, Integer data, int position, int size) { holder.imageView.setImageResource(data); } }); mBanner.isAutoLoop(true); mBanner.setIndicator(new CircleIndicator(this)); mBanner.start(); } private void initData(){ mList.add(R.drawable.a); mList.add(R.drawable.b); mList.add(R.drawable.c); mList.add(R.drawable.d); mList.add(R.drawable.e); } @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); initData(); initView(); } } 三：效果图
方法很多，这里只例举其常用的。 方法作用getRealCount()返回banner真实总数setUserInputEnabled(boolean)禁止手动滑动Banner;true 允许，false 禁止sAutoLoop(boolean)是否允许自动轮播setDelayTime(long)设置轮播间隔时间（默认3000毫秒）setScrollTime(long)置轮播滑动的时间（默认800毫秒）start()开始轮播stop()停止轮播(主要配合生命周期使用)，或者你需要手动暂停setOnBannerListener(this)设置点击事件，下标是从0开始另外需要补充说明的是，Banner也可以在生命周期回调方法里面设置其周期，例如暂停，开启等。如下所示： @Override protected void onStart() { super.onStart(); banner.start(); } @Override protected void onStop() { super.onStop(); banner.stop(); } @Override protected void onDestroy() { super.onDestroy(); banner.destroy(); }附：Demo demo地址 github |
可以看到图片中央下部有Indicator，重影的原因是从某宝首页直接截屏把Indicator也截了下来。【本文地址】
今日新闻 |
推荐新闻 |